import React,{ Component } from 'react';

import './Turnover.scss';
let qs = require('qs')

export default class Turnover extends Component{
	constructor (props) {
		super(props)
		this.state = {
			nowType: 1,
      company_id: ''
		}
	}
  render() {
    console.log(this.props.params)
    return (
      <div className='turnover-ratio'>
        <div className="turnover-title">
          成交率漏斗
        </div>
        <a href={`./userList?${qs.stringify(this.props.params)}&type=1`} className='turnover-bg4'>{this.props.data.expect1.number}</a>
        <a href={`./userList?${qs.stringify(this.props.params)}&type=2`} className='turnover-bg3'>{this.props.data.expect2.number}</a>
        <a href={`./userList?${qs.stringify(this.props.params)}&type=3`} className='turnover-bg2'>{this.props.data.expect3.number}</a>
        <a href={`./userList?${qs.stringify(this.props.params)}&type=4`} className='turnover-bg1'>{this.props.data.expect4.number}</a>
        <div className='percent'>
          <span style={{color: '#FF5F17'}}>
            <i className='glyphicon glyphicon-point'></i> ≤ 50%
          </span>
          <span style={{color: '#FEAC2A'}}>
            <i className='glyphicon glyphicon-point'></i> ≤ 80%
          </span>
          <span style={{color: '#19D35D'}}>
            <i className='glyphicon glyphicon-point'></i> ≤ 90%
          </span>
          <span style={{color: '#3EC4D3'}}>
            <i className='glyphicon glyphicon-point'></i> ≤ 100%
          </span>
        </div>
      </div>
    )
  }
}
